<template>
  <div class="shopcar">
    <el-container>
      <el-header>
        <el-link type="primary" @click="getBack" style="margin-right: 50px">返回首页</el-link>您的购物车</el-header>
      <el-main style="height: 1000px; background-color: white">
        <el-table :data="tableData" style="width: 900px;margin-left:200px" >
          <el-table-column prop="goods_date" label="日期" width="110">
          </el-table-column>
          <el-table-column prop="goods_name" label="商品名称" width="110">
          </el-table-column>
          <el-table-column prop="goods_model" label="商品型号" width="110">
          </el-table-column>
          <el-table-column prop="market_name" label="店铺名称" width="110">
          </el-table-column>
          <el-table-column prop="goods_price" label="商品价格" width="110">
          </el-table-column>
          <el-table-column prop="goods_sendState" label="发货状态" width="110">
          </el-table-column>
          <el-table-column prop="accState" label="收货状态" width="110">
          </el-table-column>
          <el-table-column label="操作" width="110">
            <template slot-scope="scope">
              <el-button @click="deletePurchase(scope.$index,tableData)" type="text" size="small">删除</el-button>
              <el-button type="text" size="small" @click="accGood(scope.row)" prop="accG">收货</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-main>
    </el-container>
  </div>
</template>
<script>
export default {
  data() {
    return {
      tableData: this.$store.state.UserGoodsInfo
    };
  },
  methods: {
    getBack() {
      this.$router.push("/");
    },
    accGood(row) {
      console.log(row);
      row.accG = true;
      row.accState = "已收货";
      this.axios
        .post("/api/shopping/haveAccGoods.php", {
          goods_id: row.goods_id,
          user_id: this.$store.state.userID,
          goods_name: row.goods_name,
          market_name: row.market_name,
          goods_model: row.goods_model,
        })
        .then((res) => {
          console.log(res.data);
          if (res.data == "ok") {
            // row.accState='已收货';
            this.$message({
              type: "success",
              message: "已收货",
            });
          } else {
            this.$message({
              type: "success",
              message: "收货失败",
            });
          }
        });
    },
    deletePurchase(index,rows) {
      let purchaseGoods = {
        goods_id: rows[index].goods_id,
        goods_model: rows[index].goods_model,
        market_name: rows[index].market_name,
        goods_sendState: rows[index].goods_sendState,
        goods_name: rows[index].goods_name,
        user_id: this.$store.state.userID,
      };
          if (rows[index].goods_sendState == "未发货" || rows[index].accState == "未收货") {
            this.$confirm("该订单可能未发货或者买家未收货，是否继续?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            }).then(() => {
                this.axios.post("/api/shopping/deletePurchase.php", purchaseGoods).then((res) => {
                  console.log(res.data);
                    if (res.data == "ok") {
                      rows.splice(index,1);
                      this.$message({
                        type: "success",
                        message: "删除成功!",
                      });
                    } else {
                      this.$message({
                        type: "success",
                        message: "服务器出错了",
                      });
                    }
                  });
              }).catch(() => {
                this.$message({
                  type: "info",
                  message: "已取消删除",
                });
              });
          } else {
            this.axios.post("/api/shopping/deletePurchase.php", purchaseGoods).then((res) => {
                if (res.data == "ok") {
                   rows.splice(index,1);
                  this.$message({
                    type: "success",
                    message: "删除成功!",
                  });
                } else {
                  this.$message({
                    type: "success",
                    message: "服务器出错了",
                  });
                }
              });
          }
    },
  },
};
</script>
<style>
.shopcar {
  background-color: white;
}
</style>
